var wolfTimer; 
// 播放背景音乐
var bg_music = new Audio("Music/bg_music.wav");
var at_music = new Audio("Music/attack.wav");
var ghost_music = new Audio("Music/g鬼笑.wav");
// 监听循环播放
$(bg_music).bind("ended", function() {
    bg_music.play();
});

// 鼠标移动
$(".container")[0].addEventListener("mousemove",function(){
    var x = event.clientX;
    var y = event.clientY;
    $(".mouse")[0].style.left = x -530 + "px";
    $(".mouse")[0].style.top  = y -130 + "px";
});

// 开始游戏
$(".gameBegan")[0].addEventListener('click',function(){
    // 倒计时
    runAnimation();
    // 平底锅
    $(".mouse").stop().fadeIn();
    $(".container")[0].style.cursor = "none";
    // 开始按钮消失
    gameBeganClose();
    setTimeout(progressReduce,4000);
    setTimeout(wolfAppear,4000);
    bg_music.volume = 0.5;
    bg_music.play();
    // 规则按钮消失
    $(".rules").stop().fadeOut();
});

// 重新开始
$(".restar")[0].addEventListener('click',function(){
    // 倒计时
    runAnimation();
    // 恢复进度条宽度
    $(".progress").width(180);
    // 退出结束界面
    $(".gameOver").stop().fadeOut(1000);
    // 平底锅
    setTimeout($(".mouse").stop().fadeIn(),4000);
    setTimeout($(".container")[0].style.cursor = "none",4000);
    // 延迟
    setTimeout(progressReduce,4000);
    // 狼现
    setTimeout(wolfAppear,4000);
    bg_music.play();
});

// 返回首页
$(".goBack")[0].addEventListener('click',function(){
    // 恢复进度条
    $(".progress").width(180);
    // 退出结束界面
    // 鬼笑
    ghost_music.play();
    $(".gameOver").stop().fadeOut(1000);
    setTimeout($(".mouse").stop().fadeOut(),4000)
    // 开始按钮显示
    gameBeganShow();
});

// 显示规则
$(".rules")[0].addEventListener('click',function(){
    // 显示规则界面
    $(".rule").stop().fadeIn(1000);
});

// 关闭规则
$(".ruleClose")[0].addEventListener('click',function(){
    // 关闭规则界面
    $(".rule").stop().fadeOut(1000);
});

// 开始按钮消失
function gameBeganShow(){$(".gameBegan").stop().fadeIn(0);};

// 开始按钮显示
function gameBeganClose(){$(".gameBegan").stop().fadeOut(1000);};

// 倒计时
function runAnimation() {
    // 倒计时初始化
    var nums = document.querySelectorAll('.nums span');
    var $counter = $('.counter')[0];
    $counter.classList.remove('hide');
    nums.forEach(num => {
        num.classList.value = '';
    });
    nums[0].classList.add('in');
    $(".nums span").stop().fadeIn();
    // 倒计时执行
    nums.forEach((num, idx) => {
        var ends = nums.length - 1;
        num.addEventListener('animationend', (e) => {
            if(e.animationName === 'goIn' && idx !== ends){
                num.classList.remove('in');
                num.classList.add('out');
            } else if (e.animationName === 'goOut' && num.nextElementSibling){
                num.nextElementSibling.classList.add('in');
            }else {
                $counter.classList.add('hide');
            }
        });
    });
}

// 进度条减少
function progressReduce(){
    var time = setInterval(function(){
        // 宽度减少
        $(".progress").width($(".progress").width()-3);
        // 进度条消失
        if($(".progress").width() <= 0){
            bg_music.pause();
            // 规则按钮显示 	
            $(".rules").stop().fadeIn();
            clearInterval(time);
            $(".mouse").stop().fadeOut();
            $(".container")[0].style.cursor = "pointer";
            $(".gameOver").stop().fadeIn(1000);
            wolfDisappear();
        };
    },1000);
};

// 狼现
function wolfAppear(){
    // 灰太狼图片
    var wolf1 = ['images/h0.png','images/h1.png','images/h2.png','images/h3.png','images/h4.png','images/h5.png','images/h6.png','images/h7.png','images/h8.png','images/h9.png'];
    // 小灰灰图片
    var wolf2 = ['images/x0.png','images/x1.png','images/x2.png','images/x3.png','images/x4.png','images/x5.png','images/x6.png','images/x7.png','images/x8.png','images/x9.png'];
    // 位置
    var address = [
        {left:"100px",top:"115px"},
        {left:"20px",top:"160px"},
        {left:"190px",top:"142px"},
        {left:"105px",top:"193px"},
        {left:"19px",top:"221px"},
        {left:"202px",top:"212px"},
        {left:"120px",top:"275px"},
        {left:"30px",top:"295px"},
        {left:"209px",top:"297px"}
    ];
    // 创建灰太狼
    var $wolfImg = $("<img src='' class='wolfImg'>");
    // 随机生成位置
    var positions = Math.round(Math.random()*8);
    // 图片位置
    $wolfImg.css({
        position:"absolute",
        left:address[positions].left,
        top:address[positions].top
    });
    var wolfType = Math.round(Math.random())==0?wolf1:wolf2;
    var addBegan = 0;
    var addEnd = 5;
    wolfTimer = setInterval(function(){
        if( addBegan > addEnd){
            $wolfImg.remove();
            clearInterval(wolfTimer);
            wolfAppear();
        }
        // 图片路径
        $wolfImg.attr("src",wolfType[addBegan]);
        addBegan++;
    },250);
    // 添加图片
    $(".container").append($wolfImg);
    // 加分 + 打击
    $(".wolfImg").one('click',function(){
        // 攻击音效
        at_music.play();
        addBegan=5;
        addEnd =9;
        if(wolfType === wolf1){
            $('.scoreValue').text(parseInt($('.scoreValue').text())+10);
        }else{
            $('.scoreValue').text(parseInt($('.scoreValue').text())-10);
        }
    });
}

// 灰太狼消失
function wolfDisappear(){
    $(".wolfImg").remove();
    clearInterval(wolfTimer);
}